<template>
  <div>
      <el-form :inline="true" :model="data" size="small" class="filter-form">
        <el-form-item label="名称">
          <el-input v-model="data.name" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="归属地">
          <el-select
            v-model="data.ownType"
            clearable
            filterable
            placeholder="请选择"
          >
            <el-option v-for="dict in dict.type.template_own_type" 
            :key="dict.value"
            :label="dict.label"
            :value="dict.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="分类">
          <el-select
            v-model="data.catType"
            clearable
            filterable
            placeholder="请选择"
          >
            <el-option v-for="dict in dict.type.template_cat_type" 
            :key="dict.value"
            :label="dict.label"
            :value="dict.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="人群">
          <el-select
            v-model="data.userType"
            clearable
            filterable
            placeholder="请选择"
          >
            <el-option v-for="dict in dict.type.template_user_type" 
            :key="dict.value"
            :label="dict.label"
            :value="dict.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="状态">
          <el-select v-model="data.status" clearable filterable placeholder="请选择">
            <el-option label="未发布" :value="0" />
            <el-option label="已发布" :value="1" />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" @click="onSubmit">搜索</el-button>
        </el-form-item>
      </el-form>
    </div>
</template>

<script>
export default {
  dicts: ['template_cat_type', 'template_own_type', 'template_user_type'],
  props: {
    data: {
      type: Object,
      default() {
        return {
          name: null,
          status: null,
          ownType: null,
          catType: null,
          userType: null,
        }
      }
    }
  },
  methods: {
    onSubmit() {
      this.$emit('search')
    }
  },
};
</script>

<style lang="sass" scoped>
</style>